<template>
	<div class="userGroup">
		<div class="right_header" :style='{"background":this.$store.getters.theme[5]}'>
			<div class="listName" :style='{"color":this.$store.getters.theme[6]}'>
			 <i class="icon iconfont">&#xe738;</i>
				告警管理/
				<span>用户组别配置</span>
			</div>
		</div>
		<div class="right_main">
			<div class="divider2"></div>
			<div class="block">
				当前组别：
				<el-select v-model="group"  filterable placeholder="请选择"  @change="change">
					<el-option v-for="item in groups" :key="item.value" :label="item.groupName" :value="item.id" ></el-option>
				</el-select>
			</div>
			<div class="listBox">
				<el-transfer v-model="user" filterable
				:titles="['未选用户', '已选用户']" 
				@change="handleChange" 
				:props="{
				      key: 'id',
				      label: 'userName'
				    }" :data="users" >
				</el-transfer>
		</div>
		<el-button type="primary" class="save" @click="save">保存</el-button>
	</div>
</div>
</template>
<script src="./userGroup.js"></script>
<style lang="stylus" rel="stylesheet/stylus" src="./userGroup.styl"></style>